<template>
  <div  v-if="appointment == null" class="appointment-view-page">
    <van-empty description="暂无预约信息" />
    <van-button type="default" @click="goBack">返回</van-button>
  </div>
 <div v-if="appointment != null" class="appointment-view-page">
    <van-cell-group >
      <van-field v-model="appointment.nickname" label="姓名" readonly />
      <van-field v-model="appointment.createTime" label="预约时间" readonly />
      <van-field v-model="appointment.address" label="预约位置" readonly />
      <!-- <van-field v-model="appointment.imgs" label="照片" readonly /> -->
      <van-field v-model="appointment.phone" label="联系电话" readonly />
      <van-field v-model="appointment.batteryName" label="预约类型" readonly />
      <van-field v-model="appointment.batteryEndurance" label="续航/公里" readonly />

    </van-cell-group>

    <van-button type="default" @click="goBack">返回</van-button>
  </div>
  </template>
  
  <script setup>
  import { ref} from 'vue';
  import { yuyuelist } from '@/api/userinfo';
  const router = useRouter();

// 假设我们从某处获得预约信息
const appointment = ref(null);

  
  const yuyueall =async () => {
      const {data} = await yuyuelist();
      console.log(data);
      if(data.code==200){
        appointment.value = data.data
      }else {
        appointment.value = null
      }
  }
  
  yuyueall()
// 返回
  const goBack =()=>{
router.push("/userinfo")
  }
  </script>
  
  <style scoped>
  .details-container {
    padding: 16px;
  }
  </style>